<template>
  <div>
    <!--下拉列表框-->
    <select v-model="selected">
      <option disabled value="">请选择：</option>
      <option value="football">足球</option>
      <option value="basketball">蓝球</option>
      <option value="baseball">棒球</option>
      <option value="volleyball">排球</option>
    </select>
    <br>
    {{ selected }}
  </div>
</template>

<script>
import { reactive, toRefs } from 'vue'

export default {
  setup () {
    const state = reactive({
      selected: 'baseball',
    })
  
    return {
      ...toRefs(state),
    }
  }
}
</script>

<style lang="scss" scoped>

</style>